<template>
  <BaseForm v-model="formDataModel" />
</template>

<script lang="ts" setup>
import type { FormInstance } from "element-plus";
import DrillInfoMaterialRecordDetailApi from "/@/api/DrillInfoMaterialRecordDetailApi.ts";
import { translate } from "/@/i18n";
import FORM_FIELD_TYPE from "/@/constants/FormFieldType.ts";
defineOptions({
  name: "DrillInfoMaterialRecordDetailEdit",
});
const props = defineProps({
  modelValue: {},
});
const emit = defineEmits(["fetch-data", "callBack"]);

const formRef = ref<FormInstance>();
const title = ref<string>("");
const dialogFormVisible = ref<boolean>(false);

const formDataModel = ref({
  columnCount: 1,
  expandLimit: 6,
  autoFit: false,
  columnWidth: "300px",
  labelPosition: "right",
  labelWidth: "100px",
  modelData: {}, //表单参数值 初始化
  callback: async (any: object) => {
    //表单执行成功后回调
    //完成数据提交
    const { message } = await DrillInfoMaterialRecordDetailApi.save(any);
    $baseMessage(message, "success", "vab-hey-message-success");
    dialogFormVisible.value = false;

    //事件及数据推送到上一层父类
    emit("callBack", any); //把表单数据推送到上一层
  },
  items: [
    //表单item数据初始化
    // {
    //   label: "学习记录id",
    //   field: "recordId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "资料id",
    //   field: "materialId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    {
      label: "资料名称",
      field: "materialName",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "描述",
      field: "description",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "资料名称",
      field: "materialType",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "报名记录",
      field: "entryId",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    // {
    //   label: "活动id",
    //   field: "drillId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "用户id",
    //   field: "userKey",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    {
      label: "手机号",
      field: "phone",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    // {
    //   label: "公司ID",
    //   field: "companyId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "员工id",
    //   field: "staffId",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    {
      label: "姓名",
      field: "staffName",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "身份证",
      field: "staffIdentity",
      clearable: true,
      type: FORM_FIELD_TYPE.INPUT,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    {
      label: "开始时间",
      field: "startTime",
      clearable: true,
      type: FORM_FIELD_TYPE.DATE,
      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },

      config: {
        props: {
          //日期精度配置
          type: "daterange",
          startPlaceholder: "开始日期",
          endPlaceholder: "结束日期",
          format: "YYYY-MM-DD",
        },
      },
    },
    {
      label: "结束时间",
      field: "endTime",
      clearable: true,
      type: FORM_FIELD_TYPE.DATE,
      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },

      config: {
        props: {
          //日期精度配置
          type: "daterange",
          startPlaceholder: "开始日期",
          endPlaceholder: "结束日期",
          format: "YYYY-MM-DD",
        },
      },
    },
    // {
    //   label: "持续时间s",
    //   field: "duration",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "资料url",
    //   field: "materialUrl",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    {
      label: "学习总结",
      field: "summary",
      clearable: true,
      type: FORM_FIELD_TYPE.EDITOR,

      placeholder: "请输入",

      rule: {
        trigger: "blur",
        validator: (rule: any, value: any, callback: any) => {
          //绑定验证
          callback();
        },
      },
    },
    // {
    //   label: "创建人",
    //   field: "creator",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "修改人",
    //   field: "reviser",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
    // {
    //   label: "排序",
    //   field: "sort",
    //   clearable: true,
    //   type: FORM_FIELD_TYPE.INPUT,

    //   placeholder: "请输入",

    //   rule: {
    //     trigger: "blur",
    //     validator: (rule: any, value: any, callback: any) => {
    //       //绑定验证
    //       callback();
    //     },
    //   },
    // },
  ],
});

//页面数据加载
onMounted(async () => {
  //初始化数据model
  if (props.modelValue.query) {
    //跳转过来时候有参数
    if (props.modelValue.query.drillInfoMaterialRecordDetailId) {
      //id存在则为编辑，加载网络数据，如上级页面带参数手动覆盖

      const { data } = await DrillInfoMaterialRecordDetailApi.getDetail({
        drillInfoMaterialRecordDetailId:
          props.modelValue.query.drillInfoMaterialRecordDetailId, //从路由中获取参数
      });
      formDataModel.value.modelData = data;
    } else {
      //新增时候则用父类页面传参默认填充可根据业务修改
      for (const key in props.modelValue.query) {
        formDataModel.value.modelData[key] = props.modelValue.query[key];
      }
    }
  }
});

//方法暴露区域  todo
defineExpose({});
</script>
